<template>
  <div>
      <h2>我是生命周期组件</h2>
      <h3>
          {{ num }}
      </h3>
      <button @click="num+=1">++</button>

      <div>
          <input v-model="count" type="text">
      </div>
  </div>
</template>

<script>
// 模块引入 (import) 在js部分中最顶层
import axios from 'axios'

export default {
    beforeCreate() {

    },
    created() {
        // axios.get("https://api-hmugo-web.itheima.net/api/public/v1/home/swiperdata").then(res => {
        //     console.log(res)
        // })
    },
    data() {
        return {
            num: 1000,
            count: 8888,
            timer: null
        }
    },
    beforeMount() {

    },
    mounted() {
        this.timer = setInterval(() => {
            console.log('111')
        }, 1000)
    },
    // data中的数据发生改变
    // 数据已经发生改变，视图没有更新
    beforeUpdate() {
        console.log(this.num)
    },
    // 数据，视图全部更新
    updated() {
        console.log('456')
    },

    // 组件销毁之前
    // 清空副作用
    beforeDestroy() {
        // 清空
        // clearInterval(this.timer)
        console.log('我准备销毁')
    },
    // 销毁完毕
    destroyed() {
        console.log('我已经销毁')
    }
}
</script>

<style>

</style>